昨天學習CSS盒模型與與佈局技術，但還沒有提到Flexbox佈局。Flexbox是現代的CSS技術，他主要是用於處理不同螢幕大小的排列設計問題。畢竟在不同設備上螢幕頁面大小也會不同，此時Flexbox佈局就顯得尤為重要。

Flexbox佈局基礎概念

為什麼說Flexbox可以較好的處理不同大小螢幕如何佈局，因為他的主要設計概念是在水平和垂直方向上設計排列元素，可以分為兩條垂直線。
1.Main Axis：稱為主軸，不一定要是直向，也可以為橫向，反正就是可以水平也能垂直然後再把元素沿其排列。
2.Cross Axis：交叉軸，垂直於主軸，他的橫或直向得看主軸怎麼排，元素也沿著交叉軸排列。
那麼透過Flexbox的佈局概念，便可以順應不同大小的螢幕設備，而且設計起來也簡單直觀，也能很好的實現佈局的水平和居中，讓版面好看點。

常用的 Flexbox 屬性：

常用的 Flexbox 屬性：
•display: flex;：將容器設置為 Flex 容器，內部的元素變為 Flex 項目。
•justify-content：控制元素在主軸上的排列方式，
例如：
center：項目在主軸上居中排列。
space-between：項目之間留出均等的空間。
•align-items：控制項目在交叉軸上的對齊方式
例如：
center：項目在交叉軸上居中排列。
flex-start：項目靠近交叉軸的起點。

CSS排版與文字樣式

再來就是要學習字體的大小、粗細、字型、行間距等等的，都是有相應的方法去控制的，這部分就是要美化網站，讓網站能狗提升視覺吸引力。
1.字體與文字樣式：
font-size：定義文字大小。
font-weight：設置文字的粗細。
2.文字對齊與行距：
text-align：控制文字的對齊方式：
•left：左對齊。
•right：右對齊。
•center：居中對齊。
•justify：兩端對齊。
3.文本修飾：
text-transform：控制文字的大小寫轉換
text-shadow：為文字添加陰影效果
4.顏色設置：
color：設置文字顏色
background-color：設置元素的背景顏色

今天先到這邊，明天繼續下個CSS環節。